<template>
  <div>
    <van-row class="heads">
      <van-icon name="arrow-left" @click="back" class="back" />
      <span> 我的优惠券 </span>
    </van-row>
    <!-- 标签 -->
    <van-tabs v-model="activeName">
      <van-tab title="可使用" name="a">
        <!-- 全平台优惠券 -->
        <van-row class="cps">
          <van-col offset="1" span="23">
            <van-row class="cpt">全平台优惠券</van-row>
            <van-row>
              <van-col class="cpl" span="8">
                <van-row>¥50</van-row>
                <van-row class="cplb">满1999减50</van-row>
              </van-col>
              <van-col span="10" class="cpc">
                <van-row class="cpct">全平台优惠券</van-row>
                <van-row>满1999减50</van-row>
                <van-row class="cpcb">2019/5/5-2019/10/10</van-row>
              </van-col>
              <van-col span="5" offset="1" class="cpr">
                <van-button
                  color="linear-gradient(to right, rgb(146, 223, 31), rgb(12, 160, 12))"
                  size="mini"
                >
                  立即使用
                </van-button>
              </van-col>
            </van-row>
          </van-col>
        </van-row>
      </van-tab>
      <van-tab title="已使用" name="b"  class="used">
        
      </van-tab>
      <van-tab title="已过期" name="c"></van-tab>
    </van-tabs>
  </div>
</template>

<script>
export default {
  name: "Fruith5Coupon",

  data() {
    return {
      activeName: 'a',
    
    
    };
  },

  mounted() {},
  created(){

  },
  methods: {
    back() {
      this.$router.go(-1);
    },
    
  },
};
</script>

<style  scoped>
.back {
  cursor: pointer;
}
.heads {
  font-size: 18px;
  font-weight: bold;
  /* line-height: 2.375rem; */
  color: white;
  background-color: rgb(0, 255, 170);
  height: 2.375rem;
  padding: 0.9375rem 0.1875rem 0rem 0.625rem;
}
.cps {
  margin-top: 0.3125rem;
  border: 0.0625rem dotted gray;
  padding: 0.3125rem;
}
.cpt {
  font-size: 0.875rem;
  font-weight: bold;
}
.cpl {
  background-color: rgb(12, 160, 12);
  color: white;
  font-weight: bold;
  text-align: center;
  margin-top: 0.625rem;
  height: 3.125rem;
  line-height: 1.5625rem;
}
.cplb {
  font-size: 0.75rem;
}
.cpc {
  padding-left: 2px;
  margin-top: 0.625rem;
  height: 3.125rem;
  font-size: 0.75rem;
  border: 0.0625rem solid green;
}
.cpct {
  font-weight: bold;
}
.cpcb {
  color: rgba(47, 255, 64, 0.836);
}
.cpr {
  margin-top: 1.25rem;
}
</style>